<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
	xmlns:h="http://xmlns.jcp.org/jsf/html"
	xmlns:f="http://xmlns.jcp.org/jsf/core"
	xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"
	xmlns:p="http://primefaces.org/ui">
<f:view>
	<f:metadata>
		<f:viewAction action="#{menuMB.updateMenu(2)}" />
	</f:metadata>
	<ui:composition template="/WEB-INF/templates/defaultLayout.xhtml">

		<!-- Definiendo la cabecera de la pagina -->
		<ui:define name="title">
			<h:outputText value="Boveda" />
		</ui:define>

		<!-- Definiendo el cuerpo de la pagina -->
		<ui:define name="content">
			<h:outputStylesheet library="css" name="main.css" />

			<h:form id="failureMessage">
				<h:panelGroup rendered="#{transaccionCajaCajaBean.failure}">
					<div class="p6n-api-access-in-page-error" style="left: 516px;">
						<div>
							<div>
								<p>
									<h:messages />
								</p>
							</div>
							<div style="text-align: center;">
								<h:commandLink value="Volver"
									action="/caja/operaciones/listarMovimientosConCaja?faces-redirect=true"
									immediate="true" styleClass="p6n-api-access-in-page-error-link" />
							</div>
						</div>
					</div>
				</h:panelGroup>
			</h:form>

			<h:panelGroup id="successConfirmationMessage">
				<h:panelGroup
					rendered="#{transaccionCajaCajaBean.successCrearTransaccion}">
					<h:form id="form2">
						<script type="text/javascript">
							window.onload = function test(){
        						document.getElementById('form2:print2').focus();
        					}
    					</script>
						<div class="modal-dialog-bg"
							style="opacity: 0.5; width: 1366px; height: 1002px;"></div>
						<div class="modal-dialog p6n-popup"
							style="left: 500px; top: 50px;">
							<div class="modal-dialog-title modal-dialog-title-draggable">
								<span class="modal-dialog-title-text">Confirmación
									Satisfactoria...</span><span class="modal-dialog-title-close"></span>
							</div>
							<p:separator></p:separator>
							<div class="modal-dialog-content ng-binding">
								<h:panelGroup id="voucher">
									<table id="t"
										style="width: 225px; border: solid 0px #E9E6E6; margin-bottom: 0px;">
										<tr style="vertical-align: center;">
											<td colspan="1"
												style="text-align: center; font-weight: bold; font-size: 12px;">
												<p:graphicImage name="logo_coop_voucher.png"
													library="images/logo_coop" />
											</td>
											<td colspan="3"
												style="text-align: left; font-weight: bold; font-size: 9px; vertical-align: middle">
												<h:outputText value="C.A.C." /> <br /> <h:outputText
													style="font-size: 16px;" value="CAJA VENTURA" />
											</td>
										</tr>
										<tr style="vertical-align: center;">
											<td colspan="4"
												style="text-align: center; font-weight: bold; font-size: 11px;">
												<h:outputText value="TRANSACCIÓN CAJA ---> CAJA" />
											</td>
										</tr>
										<tr>
											<td colspan="1" style="font-weight: bold; font-size: 10px;">AGENCIA:</td>
											<td colspan="3" style="font-size: 11px; font-family: Century Gothic;">#{transaccionCajaCajaBean.agenciaBean.agencia.denominacion}</td>
										</tr>
										<tr>
											<td colspan="1" style="font-weight: bold; font-size: 10px;">CAJA ORIGEN:</td>
											<td colspan="3"
												style="font-size: 11px; font-family: Century Gothic;">#{transaccionCajaCajaBean.transaccioncajacaja.historialcajaorigen.caja.abreviatura}</td>
										</tr>
										<tr>
											<td colspan="1"
												style="font-weight: bold; font-size: 10px;">CAJA DESTINO:</td>
											<td colspan="3"
												style="font-size: 11px; font-family: Century Gothic;">#{transaccionCajaCajaBean.transaccioncajacaja.historialcajadestino.caja.abreviatura}</td>
										</tr>
										<tr>
											<td style="width:80px; font-weight: bold; font-size: 10px;">FECHA:</td>
											<td style="font-size: 11px; font-family: Century Gothic;"><h:outputText
													value="#{transaccionCajaCajaBean.transaccioncajacaja.fecha}">
													<f:convertDateTime pattern="dd/MM/yy" />
												</h:outputText></td>
											<td
												style="text-align: right; font-weight: bold; font-size: 10px;">HORA:</td>
											<td style="font-size: 11px; font-family: Century Gothic;"><h:outputText
													value="#{transaccionCajaCajaBean.transaccioncajacaja.hora}">
													<f:convertDateTime dateStyle="full" timeZone="EST"
														type="time" />
												</h:outputText></td>
										</tr>
										<tr>
											<td colspan="1" style="font-weight: bold; font-size: 10px;">MONEDA:</td>
											<td colspan="3"
												style="font-size: 10px; font-family: Century Gothic;">#{transaccionCajaCajaBean.transaccioncajacaja.tipomoneda.denominacion} (#{transaccionCajaCajaBean.transaccioncajacaja.tipomoneda.abreviatura})</td>
										</tr>
										
										<tr>
											<td colspan="2" style="font-weight: bold; font-size: 10px;">IMPORTE:</td>
											<td colspan="2" style="font-size: 11px; text-align: right; font-family: Century Gothic;">#{transaccionCajaCajaBean.transaccioncajacaja.tipomoneda.abreviatura}#{transaccionCajaCajaBean.transaccioncajacaja.montoAsString}</td>
										</tr>
										<tr>
											<td colspan="2" style="font-weight: bold; font-size: 10px;">ESTADO:</td>
											<td colspan="2" style="font-size: 11px; text-align: right; font-family: Century Gothic;"><h:outputText
													value="#{transaccionCajaCajaBean.transaccioncajacaja.estadoconfirmacion ?  'CONFIRMADO' : 'NO CONFIRMADO'} " />
											</td>
										</tr>
										<tr>
											<td colspan="4">&nbsp;</td>
										</tr>
										<tr>
											<td colspan="4" style="font-size: 11px; text-align: center;"><h:outputText value="---------------------------------------"/>
											</td>
										</tr>
										<tr>
											<td colspan="4" style="font-size: 10px; text-align: center; font-family: Century Gothic;">
												<h:outputText value="#{usuarioMB.usuario.trabajador.personanatural.apellidopaterno} #{usuarioMB.usuario.trabajador.personanatural.apellidomaterno} #{usuarioMB.usuario.trabajador.personanatural.nombres}"/>
												<br />
												<h:outputText value="CAJA: #{cajaBean.caja.abreviatura}"/>
											</td>
										</tr>
									</table>
								</h:panelGroup>

							</div>
							<div class="modal-dialog-buttons">
								<h:commandButton value="Imprimir" type="button" id="print2"
									styleClass="action green" icon="ui-icon-print">
									<p:printer target="voucher" />
								</h:commandButton>
								<h:commandButton value="Salir" styleClass="action"
									action="listarMovimientosConCaja?faces-redirect=true"
									immediate="true" />
							</div>
						</div>
					</h:form>
				</h:panelGroup>
			</h:panelGroup>

			<h:panelGroup
				rendered="#{transaccionCajaCajaBean.successCrearTransaccion}">
				<h:form id="form1">
					<script type="text/javascript">
							window.onload = function test(){
        						document.getElementById('form1:print1').focus();
        					}
    					</script>
					<div class="modal-dialog-bg"
						style="opacity: 0.4; width: 1366px; height: 1002px;"></div>
					<div class="modal-dialog p6n-popup" style="left: 501px; top: 78px;">
						<div class="modal-dialog-title modal-dialog-title-draggable">
							<span class="modal-dialog-title-text">Creación Satisfactoria...</span><span class="modal-dialog-title-close"></span>
						</div>
						<p:separator></p:separator>
						<div class="modal-dialog-content ng-binding">

							<h:panelGroup id="voucher">
								<table id="t"
									style="width: 225px; border: solid 0px #E9E6E6; margin-bottom: 0px;">
									<tr style="vertical-align: center;">
										<td colspan="1"
											style="text-align: center; font-weight: bold; font-size: 12px;">
											<p:graphicImage name="logo_coop_voucher.png"
												library="images/logo_coop" />
										</td>
										<td colspan="3"
											style="text-align: left; font-weight: bold; font-size: 9px; vertical-align: middle">
											<h:outputText value="C.A.C." /> <br /> <h:outputText
												style="font-size: 16px;" value="CAJA VENTURA" />
										</td>
									</tr>
									<tr style="vertical-align: center;">
										<td colspan="4"
											style="text-align: center; font-weight: bold; font-size: 11px;">
											<h:outputText value="TRANSACCIÓN CAJA ---> CAJA" />
										</td>
									</tr>
									<tr>
										<td colspan="1" style="font-weight: bold; font-size: 10px;">AGENCIA:</td>
										<td colspan="3"
											style="font-size: 11px; font-family: Century Gothic;">#{transaccionCajaCajaBean.agenciaBean.agencia.denominacion}</td>
									</tr>
									<tr>
										<td colspan="1" style="font-weight: bold; font-size: 10px;">CAJA ORIGEN:</td>
										<td colspan="3"
											style="font-size: 11px; font-family: Century Gothic;">#{transaccionCajaCajaBean.cajaBean.caja.abreviatura}</td>
									</tr>
									<tr>
										<td colspan="1"
											style="font-weight: bold; font-size: 10px;">CAJA DESTINO:</td>
										<td colspan="3"
											style="font-size: 11px; font-family: Century Gothic;">#{transaccionCajaCajaBean.comboCaja.objectItemSelected.abreviatura}</td>
									</tr>
									<tr>
										<td style="width:80px; font-weight: bold; font-size: 10px;">FECHA:</td>
										<td style="font-size: 11px; font-family: Century Gothic;"><h:outputText
												value="#{transaccionCajaCajaBean.transaccioncajacaja.fecha}">
												<f:convertDateTime pattern="dd/MM/yy" />
											</h:outputText></td>
									</tr>
									<tr>
										<td
											style="font-weight: bold; font-size: 10px;">HORA:</td>
										<td style="font-size: 11px; font-family: Century Gothic;"><h:outputText
												value="#{transaccionCajaCajaBean.transaccioncajacaja.hora}">
												<f:convertDateTime dateStyle="full" timeZone="EST"
													type="time" />
											</h:outputText></td>
									</tr>
									<tr>
										<td colspan="1" style="font-weight: bold; font-size: 10px;">MONEDA:</td>
										<td colspan="3"
											style="font-size: 10px; font-family: Century Gothic;">#{transaccionCajaCajaBean.transaccioncajacaja.tipomoneda.denominacion} (#{transaccionCajaCajaBean.transaccioncajacaja.tipomoneda.abreviatura})</td>
									</tr>
									<tr>
										<td colspan="4" style="font-size: 1px;">&nbsp;</td>
									</tr>
									<tr>
										<td colspan="2" style="font-weight: bold; font-size: 10px;">IMPORTE:</td>
										<td colspan="2" style="font-size: 11px; text-align: right; text-align: right; font-family: Century Gothic;">#{transaccionCajaCajaBean.transaccioncajacaja.tipomoneda.abreviatura}#{transaccionCajaCajaBean.transaccioncajacaja.montoAsString}</td>
									</tr>
									<tr>
										<td colspan="2" style="font-weight: bold; font-size: 9px;">ESTADO:</td>
										<td colspan="2" style="font-size: 10px; text-align: right; font-family: Century Gothic;"><h:outputText
												value="#{transaccionCajaCajaBean.transaccioncajacaja.estadoconfirmacion ?  'CONFIRMADO' : 'NO CONFIRMADO'} " />
										</td>
									</tr>
								</table>
							</h:panelGroup>

						</div>
						<div class="modal-dialog-buttons">
							<h:commandButton value="Imprimir" type="button" id="print1"
								styleClass="action green" icon="ui-icon-print">
								<p:printer target="voucher" />
							</h:commandButton>
							<h:commandButton value="Salir" styleClass="action"
								action="listarMovimientosConCaja?faces-redirect=true"
								immediate="true" />
						</div>
					</div>
				</h:form>
			</h:panelGroup>

			<br />
			<br />
			<p:panel header="TRANSACCIONES RECIBIDAS"
				footer="Necesitas confirmar cada transacción para que se efectúe correctamente">
				<div>
					<h:form>
						<div style="margin: 5px;">
							<p:dataTable id="tablaTransaccionesRecibidas" var="transaccion"
								value="#{transaccionCajaCajaBean.tablaTransasccionesSolicitadas.rows}"
								selectionMode="single" paginatorPosition="bottom"
								selection="#{transaccionCajaCajaBean.tablaTransasccionesSolicitadas.selectedRow}"
								rowKey="#{transaccion}" rowIndexVar="row" paginator="true"
								rows="10" sortMode="multiple"
								paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
								rowsPerPageTemplate="5,10,15">

								<f:facet name="header">  
						            TRANSACCIONES DE CAJA 
						        </f:facet>
								<p:column headerText="Nro" width="5%" style="text-align:center;">
									<h:outputText value="#{row + 1}" />
								</p:column>
								<p:column headerText="Origen">
									<h:outputText
										value="#{transaccion.historialcajaorigen.caja.denominacion}" />
								</p:column>
								<p:column headerText="Destino">
									<h:outputText
										value="#{transaccion.historialcajadestino.caja.denominacion}" />
								</p:column>
								<p:column headerText="Moneda">
									<h:outputText value="#{transaccion.tipomoneda.denominacion}" />
								</p:column>
								<p:column headerText="Monto">
									<h:outputText value="#{transaccion.montoAsString}" />
								</p:column>
								<p:column headerText="Fecha">
									<h:outputText
										value="#{transaccionCajaCajaBean.getStringDate(transaccion.fecha)}" />
								</p:column>
								<p:column headerText="Hora">
									<h:outputText
										value="#{transaccionCajaCajaBean.getStringTime(transaccion.hora)}" />
								</p:column>
								<p:column headerText="Estado">
									<h:outputText
										value="#{transaccionCajaCajaBean.getEstadoTransaccion(transaccion.estadosolicitud,transaccion.estadoconfirmacion)}" />
								</p:column>
								<p:column headerText="STATUS" style="text-align: center;">
									<h:panelGroup
										rendered="#{transaccionCajaCajaBean.getEstadoTransaccion(transaccion.estadosolicitud,transaccion.estadoconfirmacion) == 'Por confirmar'}">
										<p:commandButton value="Confirmar" styleClass="blue"
											actionListener="#{transaccionCajaCajaBean.confirmarTransaccion(transaccion)}"
											update="tablaTransaccionesRecibidas, :successConfirmationMessage, :failureMessage"
											style="margin:0px;">
											<p:confirm header="Confirmacion" message="¿Está Seguro?"
												icon="ui-icon-alert" />
										</p:commandButton>
										<p:confirmDialog global="true" showEffect="fade"
											hideEffect="explode">
											<p:commandButton value="Si" type="button"
												styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
											<p:commandButton value="No" type="button"
												styleClass="ui-confirmdialog-no" icon="ui-icon-close" />
										</p:confirmDialog>
									</h:panelGroup>
									<h:panelGroup
										rendered="#{transaccionCajaCajaBean.getEstadoTransaccion(transaccion.estadosolicitud,transaccion.estadoconfirmacion) != 'Por confirmar'}">
										<h:outputText
											value="#{transaccionCajaCajaBean.getEstadoTransaccion(transaccion.estadosolicitud,transaccion.estadoconfirmacion)}" />
									</h:panelGroup>
								</p:column>
							</p:dataTable>
						</div>
					</h:form>
				</div>
			</p:panel>
			<br />
			<br />
			<p:panel header="TRANSACCIONES ENVIADAS"
				footer="La caja destino debe confirmar la transaccion">
				<div class="buttons">
					<h:form id="formTransEnviadas">
						<script type="text/javascript">
							window.onload = function test(){
        						document.getElementById('formTransEnviadas:crearTransaccion').focus();
        					}
    					</script>
						<div>
							<h:commandButton id="crearTransaccion" value="Crear Transaccion"
								styleClass="action green">
								<f:ajax
									listener="#{transaccionCajaCajaBean.setDlgCrearTransasccion(true)}"
									render=":dlgCrearTransaccion :formCrearTransaccion"></f:ajax>
							</h:commandButton>
						</div>
					</h:form>
				</div>
				<div>
					<h:form>
						<div style="margin: 5px;">
							<p:dataTable id="tablaTransaccionesEnviadas" var="transaccion"
								value="#{transaccionCajaCajaBean.tablaTransasccionesEnviadas.rows}"
								selectionMode="single" paginatorPosition="bottom"
								selection="#{transaccionCajaCajaBean.tablaTransasccionesEnviadas.selectedRow}"
								rowKey="#{transaccion}" rowIndexVar="row" paginator="true"
								rows="10" sortMode="multiple"
								paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
								rowsPerPageTemplate="5,10,15">

								<f:facet name="header">  
						            Transacciones de Caja 
						        </f:facet>
								<p:column headerText="Nro" width="5%" style="text-align:center;">
									<h:outputText value="#{row + 1}" />
								</p:column>
								<p:column headerText="Origen">
									<h:outputText
										value="#{transaccion.historialcajaorigen.caja.denominacion}" />
								</p:column>
								<p:column headerText="Destino">
									<h:outputText
										value="#{transaccion.historialcajadestino.caja.denominacion}" />
								</p:column>
								<p:column headerText="Moneda">
									<h:outputText value="#{transaccion.tipomoneda.denominacion}" />
								</p:column>
								<p:column headerText="Monto">
									<h:outputText value="#{transaccion.montoAsString}" />
								</p:column>
								<p:column headerText="Fecha">
									<h:outputText
										value="#{transaccionCajaCajaBean.getStringDate(transaccion.fecha)}" />
								</p:column>
								<p:column headerText="Hora">
									<h:outputText
										value="#{transaccionCajaCajaBean.getStringTime(transaccion.hora)}" />
								</p:column>
								<p:column headerText="Estado">
									<h:outputText
										value="#{transaccionCajaCajaBean.getEstadoTransaccion(transaccion.estadosolicitud,transaccion.estadoconfirmacion)}" />
								</p:column>
								<p:column headerText="STATUS" style="text-align: center;">
									<h:panelGroup
										rendered="#{transaccionCajaCajaBean.getEstadoTransaccion(transaccion.estadosolicitud,transaccion.estadoconfirmacion) == 'Por confirmar'}">
										<p:commandButton value="Cancelar" styleClass="red"
											actionListener="#{transaccionCajaCajaBean.cancelarTransaccion(transaccion)}"
											update="tablaTransaccionesEnviadas" style="margin:0px;">
											<p:confirm header="Confirmacion" message="¿Estas Seguro?"
												icon="ui-icon-alert" />
										</p:commandButton>
										<p:confirmDialog global="true" showEffect="fade"
											hideEffect="explode">
											<p:commandButton value="Yes" type="button"
												styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
											<p:commandButton value="No" type="button"
												styleClass="ui-confirmdialog-no" icon="ui-icon-close" />
										</p:confirmDialog>
									</h:panelGroup>
									<h:panelGroup
										rendered="#{transaccionCajaCajaBean.getEstadoTransaccion(transaccion.estadosolicitud,transaccion.estadoconfirmacion) != 'Por confirmar'}">
										<h:outputText
											value="#{transaccionCajaCajaBean.getEstadoTransaccion(transaccion.estadosolicitud,transaccion.estadoconfirmacion)}" />
									</h:panelGroup>
								</p:column>
							</p:dataTable>
						</div>
					</h:form>
				</div>
			</p:panel>

			<h:panelGroup id="dlgCrearTransaccion">
				<h:panelGroup
					rendered="#{transaccionCajaCajaBean.dlgCrearTransasccion}">
					<h:form id="formCrearTransaccion">
					<p:focus for="cmbCaja"></p:focus>
						<div class="modal-dialog-bg"
							style="opacity: 0.4; width: 1366px; height: 1002px;"></div>
						<div class="modal-dialog p6n-popup"
							style="left: 502px; top: 100px;">
							<div class="modal-dialog-title modal-dialog-title-draggable">
								<span class="modal-dialog-title-text">Crear transaccion</span><span
									class="modal-dialog-title-close"></span>
							</div>
							<div class="modal-dialog-content ng-binding">
								<div class="p6n-api-consent-screen-inputs">
									<div class="p6n-api-consent-screen-input-section">
										<div class="p6n-api-consent-screen-label">CAJA DESTINO</div>
										<div>
											<h:selectOneMenu id="cmbCaja"
												value="#{transaccionCajaCajaBean.comboCaja.itemSelected}"
												required="true" requiredMessage="Seleccione una caja">
												<f:selectItem itemLabel="--SELECCIONE--" itemValue="" />
												<f:selectItems
													value="#{transaccionCajaCajaBean.comboCaja.items.entrySet()}"
													var="val" itemLabel="#{val.value.denominacion}"
													itemValue="#{val.key}" />
											</h:selectOneMenu>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="cmbCaja" />
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div class="p6n-api-consent-screen-label">TIPO MONEDA</div>
										<div>
											<h:selectOneMenu id="cmbTipomoneda"
												value="#{transaccionCajaCajaBean.comboTipomoneda.itemSelected}"
												required="true" requiredMessage="Seleccione moneda">
												<f:selectItem itemLabel="--SELECCIONE--" itemValue="" />
												<f:selectItems
													value="#{transaccionCajaCajaBean.comboTipomoneda.items.entrySet()}"
													var="val" itemLabel="#{val.value.denominacion}"
													itemValue="#{val.key}" />
												<f:ajax render="txtAbreviaturaMoneda"></f:ajax>
											</h:selectOneMenu>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="cmbTipomoneda" />
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div class="p6n-api-consent-screen-label">MONTO</div>
										<div>
											<div>
												<h:outputText style="vertical-align: -webkit-baseline-middle; font-size: 15px; font-weight: bold;" id="txtAbreviaturaMoneda" value="#{transaccionCajaCajaBean.comboTipomoneda.objectItemSelected.abreviatura}" />
												<h:inputText id="txtMonto"
													value="#{transaccionCajaCajaBean.monto}" required="true"
													requiredMessage="Ingrese monto" pt:placeholder="Monto"
													autocomplete="off">
												</h:inputText>
											</div>
										</div>
									</div>
									<div
										class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
										<h:message for="txtMonto" />
									</div>
									<br />
								</div>
							</div>
							<div class="modal-dialog-buttons">
								<h:commandButton value="Aceptar"
									action="#{transaccionCajaCajaBean.createTransaccion()}"
									styleClass="action green" onclick="onSubmitButton();">
								</h:commandButton>
								<h:commandButton value="Cancelar" immediate="true"
									styleClass="action">
									<f:ajax
										listener="#{transaccionCajaCajaBean.setDlgCrearTransasccion(false)}"
										render=":dlgCrearTransaccion"></f:ajax>
								</h:commandButton>
							</div>
						</div>
					</h:form>
				</h:panelGroup>
			</h:panelGroup>
			<h:panelGroup id="dlgConfirmarTransaccion">
				<h:panelGroup>
				</h:panelGroup>
			</h:panelGroup>
		</ui:define>

	</ui:composition>
</f:view>
</html>